﻿<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/dist/css/bootstrap.min.css" />
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
<script type="text/javascript" src="/JS/jquery.min.js"></script>
<script type="text/javascript" src="/JS/ICMS/ZL_Common.js"></script>
<script type="text/javascript" src="/dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="/dist/css/font-awesome.min.css" />
<style>
    body{background:url(http://code.z01.com/web/Images/9.jpg);}
    .padding5{padding:5px;}
    .wptlp{margin-top:10%;}
    .main_div{height:560px;}
    .main_div .app_div{opacity:.7; color:white;padding-top:20%; height:130px;}
    .main_div .fa{font-size:50px;}
    .app_div .title_div{margin-top:10px;}
    .toolbar_div{ padding:10px;height:560px; color:white;position:relative;}
    .toolbar_div .tips_div{text-align:center;margin:auto;border-radius:50px;background-color:#0094ff;opacity:.7;line-height:30px;width:30px;height:30px;}
    .toolbar_div .toollist{bottom:0px;width:100%;position:absolute; text-align:center;}
    .toolbar_div .toollist .toolbtn span{font-size:25px;line-height:60px;}
</style> 
</head>
<body>
    <div class="container wptlp">
        <div class="col-xs-10 col-md-10 col-sm-10 main_div padding5">
            <div class="col-xs-6 col-md-6 col-sm-6 padding5">
                <div class="app_div" style="background-color:#ff6a00">
                    <div class="text-center icon_div"><span class="fa fa-newspaper-o"></span></div>
                    <div class="text-center title_div">今日看点</div>
                </div>
            </div>
            <div class="col-xs-6 col-md-6 col-sm-6 padding5">
                <div class="app_div" style="background-color:#0094ff">
                    <div class="text-center icon_div"><span class="fa fa-file-powerpoint-o"></span></div>
                    <div class="text-center title_div">头条热点</div>
                </div>
            </div>
            <div class="col-xs-6 col-md-6 col-sm-6 padding5">
                <div class="app_div" style="background-color:#0094ff">
                    <div class="text-center icon_div"><span class="fa fa-youtube-play"></span></div>
                    <div class="text-center title_div">娱乐八卦</div>
                </div>
            </div>
            <div class="col-xs-6 col-md-6 col-sm-6 padding5">
                <div class="app_div" style="background-color:#ff6a00">
                    <div class="text-center icon_div"><span class="fa  fa-heart"></span></div>
                    <div class="text-center title_div">我的收藏</div>
                </div>
            </div>
            <div class="col-xs-6 col-md-6 col-sm-6 padding5">
                <div class="app_div" style="background-color:#0094ff">
                    <div class="text-center icon_div"><span class="fa fa-coffee"></span></div>
                    <div class="text-center title_div">文艺频道</div>
                </div>
            </div>
            <div class="col-xs-6 col-md-6 col-sm-6 padding5">
                <div class="app_div" style="background-color:#0094ff">
                    <div class="text-center icon_div"><span class="fa fa-camera"></span></div>
                    <div class="text-center title_div">数码测评</div>
                </div>
            </div>
            <div class="col-xs-6 col-md-6 col-sm-6 padding5">
                <div class="app_div" style="background-color:#0094ff">
                    <div class="text-center icon_div"><span class="fa fa-futbol-o"></span></div>
                    <div class="text-center title_div">体育频道</div>
                </div>
            </div>
            <div class="col-xs-6 col-md-6 col-sm-6 padding5">
                <div class="app_div" style="background-color:#0094ff">
                    <div class="text-center icon_div"><span class="fa fa-car"></span></div>
                    <div class="text-center title_div">汽车频道</div>
                </div>
            </div>
        </div>
        <div class="col-xs-2 col-md-2 col-sm-2 toolbar_div">
            <div class="tips_div"></div>
            <div class="toollist">
                <div class="toolbtn"><span class="fa fa-plus"></span></div>
                <div class="toolbtn"><span class="fa fa-download"></span></div>
                <div class="toolbtn"><span class="fa fa-trash-o"></span></div>
                <div class="toolbtn"><span class="fa fa-cog"></span></div>
            </div>
        </div>
    </div>
</body>
</html>
